<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>"全局污染"&"块作用域"</title>
</head>
<body>
  <p>"全局污染"&"块作用域"</p>
  <ul>
    <li>什么是"全局污染"?即变量声明未使用var,这样变量成为了全局变量(挂载window),如果被第三方引入非常容易导致篡改</li>
    <li>启用严格模式('use strict')避免"全局"变量声明</li>
    <li>在多个脚本中，如果使用同一变量(或函数)，与脚本加载顺序有关，后加载的脚本将会覆盖之前的同名变量，导致"作用域穿透"</li>
    <li>为了防止"作用域穿透"，可使用立即执行函数或块作用域来解决，将变量限定在指定模块的作用域内生效</li>
  </ul>
  <script src="index.js"></script>
  <script src="scope.js"></script>
  <script src="functional-scope.js"></script>
  <script src="block-scope.js"></script>
  <script>
    // 'use strict'; // 启用严格模式避免"全局"变量
    user = 'Miracle He';
    show(); // 第三方来源
    console.log(user);
    // 调用
    console.log($1.name);
    console.log($1.getWeb());
    console.log($2.name);
    console.log($2.getWeb());
  </script>
</body>
</html>